import { Component, OnInit, Input, ElementRef } from '@angular/core';
import { ActivatedRoute, NavigationEnd, Router } from '@angular/router';
import { filter } from 'rxjs/operators';

@Component({
  selector: 'app-sider',
  templateUrl: './sider.component.html',
  styleUrls: ['./sider.component.scss']
})
export class SiderComponent implements OnInit {

  currentUrl: string;

  constructor(
    private elementRef: ElementRef,
    private router: Router,
    private activatedRoute: ActivatedRoute
  ) {
  }

  @Input() isCollapsed: boolean;

  ngOnInit() {
    this.elementRef.nativeElement.replaceWith(document.getElementById('siderContainer'));
    this.currentUrl = this.activatedRoute.snapshot['_routerState'].url;

    this.router.events.pipe(filter(event => event instanceof NavigationEnd))
      .subscribe((event) => {
        this.currentUrl = this.activatedRoute.snapshot['_routerState'].url;
      });
  }
}
